<template>
	<div class="app-container">
    <el-form :inline="true" :model="dataForm" @submit.native.prevent @keyup.enter.native="getDataList()">
      <el-form-item>
        <el-input placeholder="请验编号" v-model="dataForm.queryCheckId" :clearable="true" type="number" size="mini">
          <template slot="prepend">请验编号</template>
        </el-input>
      </el-form-item>
      <br />
      <el-form-item>
        <el-input placeholder="品名" v-model="dataForm.productName" :clearable="true" size="mini">
          <template slot="prepend">品名</template>
        </el-input>
      </el-form-item>

      <el-form-item>
        <el-input placeholder="GMP编码" v-model="dataForm.productGmp" :clearable="true" size="mini">
          <template slot="prepend">GMP编码</template>
        </el-input>
      </el-form-item>

      <el-form-item>
        <el-input placeholder="物料编码" v-model="dataForm.batchNum" :clearable="true" size="mini">
          <template slot="prepend">物料编码</template>
        </el-input>
      </el-form-item>

      <el-form-item>
        <el-select v-model="dataForm.status" clearable placeholder="全部状态" size="mini">
          <el-option label="未收分" value="2,3" />
          <el-option label="未收样" value="2" />
          <el-option label="未分发" value="3" />
          <el-option label="已分发" value="4,5,6,10,7,8,11" />
      	</el-select>
      </el-form-item>

      <el-form-item v-if="userInfo.types.length != 0">
        <el-select v-model="dataForm.checkTypeId" clearable placeholder="全部分类" size="mini">
          <el-option
            v-for="t in userInfo.types"
            :key="t.checkTypeId"
            :label="t.checkTypeName"
            :value="t.checkTypeId">
          </el-option>
      	</el-select>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" class="pan-btn primary-btn" @click="searchData()" icon="el-icon-search" size="mini">搜索</el-button>
      </el-form-item>
      <el-form-item>
        <el-button type="danger" class="pan-btn danger-btn" v-if="isAuth('check:receive')" @click="receive()" icon="el-icon-shopping-bag-2" :disabled="selectionList.length == 0" size="mini">收样</el-button>
      </el-form-item>
      <el-form-item>
        <el-button type="success" class="pan-btn success-btn" v-if="isAuth('check:dispense:editprint')" @click="print()" icon="el-icon-printer" size="mini">编辑打印</el-button>
      </el-form-item>
    </el-form>

    <el-table
    	:data="dataList"
    	v-loading="dataListLoading"
      ref="dataTable"
    	border
      fit
      highlight-current-row
    	@selection-change="selectionChange"
      style="width: 100%">
    <el-table-column
      type="selection"
      header-align="center"
      align="center"
      width="50">
    </el-table-column>
    <el-table-column
    	prop="checkId"
    	header-align="center"
    	align="center"
    	label="编号"
      width="80">
    </el-table-column>
    <el-table-column
    	prop="status"
    	header-align="center"
    	align="center"
    	label="状态"
      width="80">
      <template slot-scope="{row}">
        <el-tag :type="row.status < 3 ? 'danger' : row.status > 6 ? 'success' : 'warning'" size="small">
          {{ row.status | statusFilter }}
        </el-tag>
      </template>
    </el-table-column>
    <el-table-column
    	prop="checkTypeName"
    	header-align="center"
    	align="center"
    	label="分类"
      width="60">
    </el-table-column>
    <el-table-column
    	prop="productName"
    	header-align="center"
    	align="center"
    	label="品名">
    </el-table-column>
    <el-table-column
    	prop="batchNum"
    	header-align="center"
    	align="center"
    	label="物料编码">
    </el-table-column>
    <el-table-column
    	prop="productSpec"
    	header-align="center"
    	align="center"
    	label="货品规格">
      <template slot-scope="{row}">
        <span v-html="row.productSpec"></span>
      </template>
    </el-table-column>
    <el-table-column
      prop="procedureName"
      header-align="center"
      align="center"
      label="工序"
      width="60">
      <template slot-scope="{row}">
        {{ row.procedureName }}
      </template>
    </el-table-column>
    <el-table-column
    	prop="getUserName"
    	header-align="center"
    	align="center"
    	label="取样人"
      width="80">
    </el-table-column>
    <el-table-column
    	prop="getDate"
    	header-align="center"
    	align="center"
    	label="取样时间">
      <template slot-scope="{row}">{{row.getDate | changeTime}}</template>
    </el-table-column>
    <el-table-column
    	prop="getQuantity"
    	header-align="center"
    	align="center"
    	label="取样量">
      <template slot-scope="{row}">{{row.getQuantity + row.getUnitName}}</template>
    </el-table-column>
    <el-table-column
    	prop="receiveUserName"
    	header-align="center"
    	align="center"
    	label="收样人"
      width="80">
    </el-table-column>
    <el-table-column
    	prop="receiveDate"
    	header-align="center"
    	align="center"
    	label="收样时间">
      <template slot-scope="{row}">{{row.receiveDate | changeTime}}</template>
    </el-table-column>
    <el-table-column
    	prop="dispenseUserName"
    	header-align="center"
    	align="center"
    	label="分发人"
      width="80">
    </el-table-column>
    <el-table-column
    	prop="dispenseDate"
    	header-align="center"
    	align="center"
    	label="分发时间">
      <template slot-scope="{row}">{{row.dispenseDate | changeTime}}</template>
    </el-table-column>
    <el-table-column
    	prop="dispenseQuantity"
    	header-align="center"
    	align="center"
    	label="分发量">
      <template slot-scope="{row}">{{row.dispenseQuantity == null ? null : row.dispenseQuantity + row.dispenseUnitName}}</template>
    </el-table-column>
    <el-table-column
      v-if="dataForm.checkTypeId == 6"
      prop="stabilityModeName"
      header-align="center"
      align="center"
      label="考察方式">
      <template slot-scope="{row}">
        {{ row.stabilityModeName + ' ' + row.timeValue + row.timeName }}
      </template>
    </el-table-column>
    <el-table-column
    	prop="remark"
    	header-align="center"
    	align="center"
    	label="备注">
      <template slot-scope="{row}">{{row.checkTypeId != 6 ? row.remark : row.remark == null ? (row.stabilityModeName + row.timeValue + row.timeName) : (row.remark + '(' + row.stabilityModeName + row.timeValue + row.timeName + ')')}}</template>
    </el-table-column>
    <el-table-column
      header-align="center"
      align="center"
      label="操作"
      width="140">
      <template slot-scope="scope">
        <el-button type="danger" class="pan-btn danger-btn" size="mini" @click="receive(scope.row)" v-if="scope.row.status == 2 && isAuth('check:receive')">收样</el-button>
        <el-button type="warning" class="pan-btn warning-btn" size="mini" @click="dispense(scope.row)" v-if="scope.row.status == 3 && isAuth('check:dispense')">分发</el-button>
        <el-button type="success" class="pan-btn success-btn" size="mini" @click="print(scope.row)" v-if="scope.row.status != 9 && scope.row.status > 3 && isAuth('check:dispense:print')">打印</el-button>
		<el-button type="success" class="pan-btn success-btn" size="mini" @click="printLybq(scope.row)" v-if="scope.row.status != 9 && scope.row.status > 3 && isAuth('check:dispense:print')">留样标签</el-button>
        <el-button type="danger" class="pan-btn danger-btn" size="mini" @click="updateTime(scope.row)" v-if="scope.row.status > 2 && scope.row.status <= 6">改时间</el-button>
      </template>
    </el-table-column>
    <el-table-column
      header-align="center"
      align="center"
      label="详情"
      width="100">
      <template slot-scope="scope">
        <el-button type="info" class="pan-btn info-btn" size="mini" @click="info(scope.row)">查看详情</el-button>
      </template>
    </el-table-column>
    </el-table>
    <el-pagination
      @size-change="sizeChangeHandle"
      @current-change="currentChangeHandle"
      :current-page="pageIndex"
      :page-sizes="[10, 20, 50, 100]"
      :page-size="pageSize"
      :total="totalPage"
      layout="total, sizes, prev, pager, next, jumper"
    ></el-pagination>

    <check-info
      v-if="infoVisible"
      @close="close('infoVisible')"
      @refreshData="getDataList"
      :childDataForm="childDataForm" />

    <receive
      v-if="receiveVisible"
      @close="close('receiveVisible')"
      @refreshData="getDataList"
      :childDataForm="childDataForm" />

    <dispense
      v-if="dispenseVisible"
      @close="close('dispenseVisible')"
      @refreshData="getDataList"
      :childDataForm="childDataForm" />

    <print-dispense-preview
      v-if="printVisible"
      @close="close('printVisible')"
      :childDataForm="childDataForm" />
	  
	  <yfb-stay
	  v-if="yfbStayVisible"
	  @close="close('yfbStayVisible')"
	  :childDataForm="childDataForm"
	  />
	  
	  <zc-stay
	  v-if="zcStayVisible"
	  @close="close('zcStayVisible')"
	  :childDataForm="childDataForm"
	  />

    <el-dialog
      title="修改日期"
      :visible.sync="updateTimeVisible"
      :before-close="closeUpdateTime"
      :append-to-body="true"
      width="20%">
      <el-form>
        <el-form-item label="收样日期" v-if="updateForm.receiveDate != null">
          <el-date-picker
            v-model="updateForm.receiveDate"
            :clearable="false"
            align="right"
            type="date"
            placeholder="收样日期"
            style="width: 100%"
            format="yyyy 年 MM 月 dd 日"
            value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="分发日期" v-if="updateForm.dispenseDate != null">
          <el-date-picker
            v-model="updateForm.dispenseDate"
            :clearable="false"
            align="right"
            type="date"
            placeholder="分发日期"
            style="width: 100%"
            format="yyyy 年 MM 月 dd 日"
            value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closeUpdateTime">取 消</el-button>
        <el-button type="primary" class="pan-btn primary-btn" @click="submitUpdate">确 定</el-button>
      </span>
    </el-dialog>

	</div>
</template>

<script>
  import { mapGetters } from 'vuex'
  import CommonMethod from '@/views/mixin/common'
  import { CODE_OK } from '@/common/js/config'
  import { isBlank,dateCompare } from '@/common/js/utils'
  import { checkList,updateReceiveAndDispenseTime } from '@/api/check'
  import CheckInfo from '@/views/modules/process/common/check-info'
  import Receive from './receive'
  import Dispense from './dispense'
  import PrintDispensePreview from '@/views/modules/statistics/printdispense-preview'
  import YfbStay from '@/views/modules/statistics/yfb-stay'
  import ZcStay from '@/views/modules/statistics/zc-stay'
	export default {
    name: 'shouyangyufenfa',
    filters: {
      statusFilter(status) {
        const statusMap = {
          0: '待处理',
          1: '待取样',
          2: '待收样',
          3: '待分发',
          4: '检验中',
          5: '检验中',
          6: '待结论',
          10: '待放行',
          7: '待放行',
          8: '待确认',
          11: '已完成',
          9: '已作废'
        }
        return statusMap[status]
      }
    },
    mixins: [CommonMethod],
    components: {
    	CheckInfo,Receive,Dispense,PrintDispensePreview,YfbStay,ZcStay
    },
		data(){
      return{
        currentStatus: 2,
        dataList: [],
        pageIndex: 1,
        pageSize: 10,
        totalPage: 0,
        dataListLoading: false,
        dataForm: {
          status: '2,3'
        },
        childDataForm: '',
        selectionList: [],
        infoVisible: false,
        receiveVisible: false,
        dispenseVisible: false,
        printVisible: false,
        updateTimeVisible: false,
		yfbStayVisible:false,
		zcStayVisible:false,
        updateForm: ''
      }
		},
    computed: {
      ...mapGetters([
         'userInfo'
      ])
    },
    mounted() {
      this.getInfo()
    },
		methods:{
      submitUpdate() {
        if (!isBlank(this.updateForm.receiveDate)) {
          if (!dateCompare(this.updateForm.getDate, this.updateForm.receiveDate)) {
            this.$message.error("收样日期必须晚于取样日期")
            return
          }
        }
        if (!isBlank(this.updateForm.dispenseDate)) {
          if (!dateCompare(this.updateForm.receiveDate, this.updateForm.dispenseDate)) {
            this.$message.error("分样日期必须晚于收样日期")
            return
          }
        }
        updateReceiveAndDispenseTime(this.updateForm).then(res => {
          if (res.code === CODE_OK) {
            this.$message.success('修改成功')
            this.updateTimeVisible = false
            this.getDataList()
          }else{
            this.$message.error(res.msg)
          }
        })
      },
      closeUpdateTime() {
        this.updateTimeVisible = false
        this.updateForm = ''
      },
      updateTime(row) {
        this.updateForm = JSON.parse(JSON.stringify(row))
        this.updateTimeVisible = true
      },
      print(row) {
        if (row) {
          this.childDataForm = {
            isEdit: false,
            list: row
          }
        }else{
          this.childDataForm = {
            isEdit: true
          }
        }
        this.printVisible = true
      },
		printLybq(row){
			this.childDataForm = { list: row }
			if(row.checkTypeId == 4 || row.checkTypeId == 5 ){
				this.zcStayVisible = true
			}else{
				this.yfbStayVisible = true
			}
		},
      searchData() {
      	this.pageIndex=1
      	this.getDataList()
      },
      getInfo() {
        this.getDataList()
      },
      getDataList() {
      	this.dataListLoading = true
        const params = {
        	page: this.pageIndex,
          limit: this.pageSize,
          status: this.dataForm.status || '2,3,4,5,6,10,7,8,11',
          checkTypeId: this.dataForm.checkTypeId || this.userInfo.types.map(t => {return t.checkTypeId}).join(','),
        	productName: this.dataForm.productName || null,
          productGmp: this.dataForm.productGmp || null,
          batchNum: this.dataForm.batchNum || null,
          checkId: this.dataForm.queryCheckId || null
        }
        checkList(params).then(res => {
        	if (res.code === CODE_OK) {
        		this.dataList = res.page.list
        		this.totalPage = res.page.totalCount
        	}else{
        		this.$message.error(res.msg)
        	}
        	this.dataListLoading = false
        }).catch()
      },
      info(row) {
        this.childDataForm = {
          currentStatus: this.currentStatus,
          info: row
        }
        this.infoVisible = true
      },
      receive(row) {
        let c = row ? [row] : this.selectionList
        this.childDataForm = JSON.parse(JSON.stringify(c))
        this.receiveVisible = true
      },
      dispense(row) {
        this.childDataForm = JSON.parse(JSON.stringify(row))
        this.dispenseVisible = true
      },
      close(val) {
        this.childDataForm = ''
        this[val] = !this[val]
      },
      selectionChange(items) {
      	this.selectionList = items.filter(item => {
          return item.status == 2
        })
      },
      checked(index) {
      	this.$refs.dataTable.toggleRowSelection(this.dataList[index],false)
      }
		}
	}
</script>

<style scoped>
  >>> .el-form-item__content {
    line-height: normal;
  }
</style>
